<template>
  <dv-border-box-8 style="padding-top: 10px">
    <dv-decoration-7 style="width: 100%; height: 30px"
      >销售统计</dv-decoration-7
    >
    <div id="SaleStatistics" style="width: 100%; height: 250px"></div>
  </dv-border-box-8>
</template>

<script>
import { getSaleStat } from "@/api/dv/carbon";

export default {
  name: "SaleStatistics",
  mounted() {
    this.initEchart();
  },
  methods: {
    initEchart() {
      let myChart = this.$echarts.init(
        document.getElementById("SaleStatistics"),
        "dark"
      );

      let option = {
        backgroundColor: "",
        title: {
          text: "销售额",
        fontSize :10
        },
        fontSize :10,
        tooltip: {
          trigger: "axis",
        },
        legend: {
          data: ["合同额", "总销售额"],
        },
        grid: {
          left: "3%",
          right: "4%",
          bottom: "3%",
          containLabel: true,
        },
        toolbox: {
          feature: {
            saveAsImage: {},
          },
        },
        xAxis: {
          type: "category",
          boundaryGap: false,
          data: [
            "2022-11",
            "2022-12",
            "2023-01",
            "2023-02",
            "2023-04",
            "2023-05",
            "2023-16",
          ],
        },
        yAxis: {
          type: "value",
        },
        series: [
          {
            name: "合同额",
            type: "line",
            stack: "Total",
            data: [0, 8100, 2900, 0, 0, 0, 0],
               smooth: true
          },
          {
            name: "总销售额",
            type: "line",
            stack: "Total",
            data: [0, 1500, 191, 0, 0, 0, 0],
               smooth: true
          },
        ],
      };
      option && myChart.setOption(option);
    },
  },
};
</script>

<style scoped>
</style>
